<script setup lang="ts">
import {PropType, ref} from 'vue'
import HomeView from "./view/HomeView.vue";
import {BrowserWindow, ipcRenderer} from "electron";
import MySqlConnectInfo from "./model/mysql/MySqlConnectInfo";

const windowWidth = ref(0);
const windowHeight = ref(0);
//获取拖动的窗口
ipcRenderer.on('window-resize', (event, {width, height}) => {
  // 处理窗口尺寸变化
  console.log(`Window size: ${width}x${height}`);
  // 可以根据需求将宽度和高度传递到组件的数据属性中
  windowWidth.value = width;
  windowHeight.value = height;
});

const connectInfo = ref<MySqlConnectInfo>({
  connectName: '',
  host: '',
  port: 3306,
  user: '',
  password: '',
  type: 'mysql'
})
</script>

<template>
  <n-loading-bar-provider>
    <n-notification-provider placement=" { placement: 'top', text: '上' }">
      <n-message-provider>
        <div id="content" >
          <HomeView/>
<!--          <ConnectInfoAddOrEdit :connectInfo="connectInfo"/>-->
        </div>
      </n-message-provider>
    </n-notification-provider>
  </n-loading-bar-provider>


</template>

<style>

* {
  margin: 0;
  padding: 0;
}

#content {
  width: 100%;
  height: 100%;
  background-color: #F7F8FA;
}

.gutter {
  background-color: #f0f0f0;
  background-repeat: no-repeat;
  background-position: 50%;
}

.gutter .gutter-vertical {
  background-image: url('');
  cursor: row-resize;
}

</style>
